import { useState, useEffect } from "react";

const Effect = () => {
  const [count, setCount] = useState(0);
  useEffect(() => {
    console.log("组件挂载时执行");
    // 空依赖数组表示只在组件挂载时执行
  }, []);
  //   count变化时执行
  useEffect(() => {
    console.log("更新时执行:", count);
  }, [count]);
  useEffect(() => {
    return () => {
      console.log("组件卸载时执行");
    };
  }, []);

  return (
    <>
      <h1>Effect</h1>
      <div>
        <h2>{count}</h2>
        <button onClick={() => setCount(count + 1)}>点击+1</button>
      </div>
    </>
  );
};
export default Effect;

// export default class Cls {
//   componentDidMount() {
//     console.log("挂载后");
//   }
//   componentWillUnmunt() {
//     console.log("卸载前");
//   }
// }
